<template>
  <div class="page flex-col" style="position: absolute; z-index: 9999;">
    <div class="box_1 flex-col">
      <div class="group_1 flex-col">
        <div class="box_2 flex-row">
          <img class="label_1" referrerpolicy="no-referrer" src="./assets/img/891d2e61bffceca2f255054bc7cf76c7.png" />
          <span class="text_1">设备数据总览</span>
          <img class="label_2" @click="closePop" referrerpolicy="no-referrer" src="./assets/img/08173e0df6f7022d4bd7c12c49b6575b.png" />
        </div>
        <div class="box_3 flex-row justify-between">
          <div class="section_1 flex-col">
            <div class="section_2 flex-row justify-between" >
              <div class="box_4 flex-col" :style="{ background: info.stxt === '报警' ? '#cf2200' : (info.stxt === '离线' ? '' : '#00ce2b') }"></div>
              <span class="text_2">{{ info.statusText||'离线' }}</span>
            </div>
            <div class="text-wrapper_1 flex-row"><span class="text_3">{{ info.Name }}</span></div>
          </div>
          <div class="section_3 flex-col justify-between">
            <div class="section_4 flex-col">
              <div class="section_5 flex-row">
                <img class="thumbnail_1" referrerpolicy="no-referrer"
                  src="./assets/img/88394d7d83ef3da06627ecfd031d37d4.png" />
                <span class="text_4">设备编号</span>
                <img class="thumbnail_2" referrerpolicy="no-referrer"
                  src="./assets/img/94cfd10ab8c9b96250590dd8a84fc8b7.png" />
                <span class="text_5">生产数量</span>
                <img class="thumbnail_3" referrerpolicy="no-referrer"
                  src="./assets/img/63a1ca160e24d4a49c894373b6f5c265.png" />
                <span class="text_6">设备生产数量</span>
              </div>
              <div class="text-wrapper_2 flex-row">
                <span class="text_7">{{  info.Name }}</span>
                <span class="text_8">{{ info.ProductionNumber  }}</span>
                <span class="text_9">{{ info.SetProductionNumber  }}</span>
              </div>
            </div>
            <div class="section_6 flex-col">
              <div class="group_2 flex-row">
                <img class="thumbnail_4" referrerpolicy="no-referrer"
                  src="./assets/img/1d8968e67a72e340e37b123d1a4775a5.png" />
                <span class="text_10">射嘴温度</span>
                <img class="thumbnail_5" referrerpolicy="no-referrer"
                  src="./assets/img/6bf4128d6a0f510b77b337f8813bfe74.png" />
                <span class="text_11">实时射嘴温度</span>
                <img class="thumbnail_6" referrerpolicy="no-referrer"
                  src="./assets/img/9c538271ec0fe3157ed639032d34f18a.png" />
                <span class="text_12">实时油温</span>
              </div>
              <div class="text-wrapper_3 flex-row justify-between">
                <span class="text_13">{{ info.SheZuiTemperature  }}</span>
                <span class="text_14">{{ info.SheZuiRealTemperature  }}</span>
                <span class="text_15">{{ info.OilRealTemperature  }}</span>
              </div>
            </div>
            <div class="section_7 flex-col">
              <div class="block_1 flex-row">
                <img class="thumbnail_7" referrerpolicy="no-referrer"
                  src="./assets/img/3c10f24241853f01d448170ad2dd2670.png" />
                <span class="text_16">报警内容</span>
                <!-- <img class="thumbnail_8" referrerpolicy="no-referrer"
                  src="./assets/img/696826b52edc97b3cfddb9ce7590ed52.png" />
                <span class="text_17">射胶时间</span>
                <img class="thumbnail_9" referrerpolicy="no-referrer"
                  src="./assets/img/4b5a9ddfaeb63972d645f483fff59235.png" />
                <span class="text_18">熔胶时间</span> -->
              </div>
               <div class="text-wrapper_4 flex-row justify-between">
                <div class="text_19">{{ info.AlarmContent || '暂无' }}</div>
                <!-- <span class="text_20">30</span>
                <span class="text_21">20</span> -->
              </div>
              <!--<div class="block_2 flex-row">
                <img class="thumbnail_10" referrerpolicy="no-referrer"
                  src="./assets/img/aa0a5182843b13185adba6fd5bbee115.png" />
                <span class="text_22">锁模时间</span>
                <img class="thumbnail_11" referrerpolicy="no-referrer"
                  src="./assets/img/13281681e82208f8087f70fe3848d747.png" />
                <span class="text_23">循环时间</span>
                <img class="thumbnail_12" referrerpolicy="no-referrer"
                  src="./assets/img/c4e7f562b2bdfe7d31007bebb08fca2a.png" />
                <span class="text_24">运行时间</span>
              </div>
              <div class="text-wrapper_5 flex-row">
                <span class="text_25">20</span>
                <span class="text_26">5</span>
                <span class="text_27">1200</span>
              </div> -->
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props:['info'],
  data() {
    return {
      constants: {}
    };
  },
  methods: {
    closePop() {
      this.$emit('close');
    }
  }
};
</script>
<style scoped lang="scss" src="./assets/index.scss" />